$(function(){
	var delParent;
	var defaults = {
		fileType         : ["jpg","png","bmp","jpeg"],   // 上传文件的类型
		fileSize         : 200 * 1024               // 上传文件的大小 200M
	};
		/*点击图片的文本框*/
	$(".file").change(function(){	 
		var idFile = $(this).attr("id");
		var file = document.getElementById(idFile);
		var imgContainer = $(this).parents(".z_photo").find(".z_photoitem"); //存放图片的父亲元素
		var fileList = file.files; //获取的图片文件
		var input = $(this).parent();//文本框的父亲元素
		var imgArr = [];
		var self = $(this);
		//遍历得到的图片文件
		var numUp = imgContainer.find(".up-section").length;
		var totalNum = numUp + fileList.length;  //总的数量
		if(fileList.length > 5 || totalNum > 5 ){//一次选择上传超过5个 或者是已经上传和这次上传的到的总数也不可以超过5个
			Swal.fire({
	          title:'',
	          showCloseButton:true,
	          allowOutsideClick:false,
	          html:'<div class="alert-text">上传图片数目不可以超过5个，请重新选择！</div>',
	          confirmButtonText: '确定'
	        });
		}
		else if(numUp < 5){
			fileList = validateUp(fileList);
			for(var i = 0;i<fileList.length;i++){
			 var imgUrl = window.URL.createObjectURL(fileList[i]);
			     imgArr.push(imgUrl);
			 var $section = $("<section class='up-section fl loading'><i class='fa fa-spinner'></i>");
			     //imgContainer.prepend($section);
			     $section.appendTo(imgContainer);
			 var $span = $("<span class='up-span'>");
			     $span.appendTo($section);
			
		     var $img0 = $("<i class='fa fa-times close-upimg'></i>").on("click",function(event){
				    event.preventDefault();
					event.stopPropagation();
			        Swal.fire({
			          title:'',
			          showCloseButton:true,
			          showCancelButton: true,
			          allowOutsideClick:false,
			          html:'<div class="alert-text">您确定要删除作品图片吗？</div>',
			          confirmButtonText: '确定',
			          cancelButtonText: "取消"
			        }).then((result) => {
			          if (result.value) {
			            var numUp = delParent.siblings().length;
						if(numUp < 5){
							delParent.closest(".z_photo").find(".z_file").show();
						}
					 	delParent.remove();
		 				self.parents(".z_photo").find(".z_numfirst").text(numUp);
			          }
			        });
					delParent = $(this).parent();
				});   
				$img0.appendTo($section);
		     var $img = $("<img class='up-img up-opcity'>");
		         $img.attr("src",imgArr[i]);
		         $img.appendTo($section);
		     var $p = $("<p class='img-name-p'>");
		         $p.html(fileList[i].name).appendTo($section);
		     var $input = $("<input id='taglocation' name='taglocation' value='' type='hidden'>");
		         $input.appendTo($section);
		     var $input2 = $("<input id='tags' name='tags' value='' type='hidden'/>");
		         $input2.appendTo($section);
		      
		   }
		   $(this).parents(".z_photo").find(".z_numfirst").text(totalNum);
		}
		setTimeout(function(){
             $(".up-section").removeClass("loading");
		 	 $(".up-img").removeClass("up-opcity");
		 },450);
		 numUp = imgContainer.find(".up-section").length;
		if(numUp >= 5){
			$(this).parent().hide();
		}
	});
	
    $(".z_photo").delegate(".close-upimg","click",function(){
    	delParent = $(this).parent();
        Swal.fire({
          title:'',
          showCloseButton:true,
          showCancelButton: true,
          allowOutsideClick:false,
          html:'<div class="alert-text">您确定要删除作品图片吗？</div>',
          confirmButtonText: '确定',
          cancelButtonText: "取消"
        }).then((result) => {
          if (result.value) {
            var numUp = delParent.siblings().length;
			if(numUp < 5){
				delParent.closest(".z_photo").find(".z_file").show();
			}
		 	delParent.remove();
		 	var imglen = imgContainer.find(".up-section").length;
		 	self.parents(".z_photo").find(".z_numfirst").text(imglen);
          }
        });
	});
	
	function validateUp(files){
		var arrFiles = [];//替换的文件数组
		for(var i = 0, file; file = files[i]; i++){
			//获取文件上传的后缀名
			var newStr = file.name.split("").reverse().join("");
			if(newStr.split(".")[0] != null){
					var type = newStr.split(".")[0].split("").reverse().join("");
					console.log(type+"===type===");
					if(jQuery.inArray(type, defaults.fileType) > -1){
						// 类型符合，可以上传
						if (file.size >= defaults.fileSize) {
							console.log(file.size);
							Swal.fire({
					          	title:'',
					          	showCloseButton:true,
					          	allowOutsideClick:false,
					          	html:'<div class="alert-text">您这个'+ file.name +'文件超过200K</div>',
					          	confirmButtonText: '确定'
					        });
						} else {
							// 在这里需要判断当前所有文件中
							arrFiles.push(file);	
						}
					}else{
						Swal.fire({
				          	title:'',
				          	showCloseButton:true,
				          	allowOutsideClick:false,
				          	html:'<div class="alert-text">您这个'+ file.name +'"上传类型不符合</div>',
				          	confirmButtonText: '确定'
				        });
					}
				}else{
					Swal.fire({
			          	title:'',
			          	showCloseButton:true,
			          	allowOutsideClick:false,
			          	html:'<div class="alert-text">您这个'+ file.name +'"没有类型, 无法识别</div>',
			          	confirmButtonText: '确定'
			        });
				}
		}
		return arrFiles;
	}

	$( ".z_photoitem" ).sortable({
      	items: ".up-section",
      	cursor: "move",
      	opacity: 0.6,   
      	revert: true, 
      	update : function(event, ui){       //更新排序之后
         // alert($(this).sortable("toArray"));
     	},
     	start: function(event, ui) {
            dragging = true;
        },
      	stop: function( event, ui ) {//拖拽后的事件

      		console.log($(ui.item).index());   //$(ui.item).index();移动后当前的索引值，可以作为记录当前位置的
      	}
    });
})
